<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>demom</title>
	<script src="jquery-3.4.1.min.js"></script>
<style type="text/css">


</style>
</head>
<body>
	
	<div class="box">
		<ul class="boxul">
			<li class="boxUlLi">111</li>
			<li>222</li>
			<li class="boxUlLi">333</li>
			<li>444</li>
		</ul>
		<ol>
			<li name="ol_li">333</li>
			<li>444</li>
		</ol>
	<div class="div1">
		11<input type="text" id="inputVal" value="input的value">22
	</div>

	</div>



<script type="text/javascript">


/*$(function(){//页面加载完成再执行,方法二
	
})
*/


window.onload = function(){//页面加载完成再执行,方法一



//改变css样式
		// $(".box").css("backgroundColor",'red')
//从name值选中元素
		// $("[name=ol_li]").css("backgroundColor",'red')
		
//第一
		// $("li:first").css("backgroundColor",'red')
//最后	
		// $("li:last").css("backgroundColor",'red')
//js写法，下标从1开始，child值为相对父级元素开始数起
		//$("li:nth-child(1)").css("backgroundColor",'red')
//jq方法，一：下标从0开始，遍历全局的li标签
		//$("li:eq(4)").css("backgroundColor",'red')
//jq方法，二：下标从0开始，遍历全局的li标签
		//$("li").eq(4.).css("backgroundColor",'red')
//全局单数位的li	
		//$("li:even").css("backgroundColor",'red')
//全局双数位的li	
		//$("li:odd").css("backgroundColor",'yellow')

//过滤器,过滤器选中的元素为将要操作的DOM元素  （过滤器未成功，待测）
		//$(".box").filter(".boxul").css("backgroundColor","red")



//鼠标移入移出事件
	/*	$(".boxul").mouseover(function(){
			this.style.backgroundColor = "red";
		})
			.mouseout(function(){
			this.style.backgroundColor = "";
		})
*/

//获取选中元素之内的所有html代码，包括空格
		//alert($(".div1").html())
//获取选中元素之内的所有text代码，包括空格,不包括html代码
		//alert($(".div1").text())

//先弹出input的val值，再修改input的val值
		// alert( $('#inputVal').val() )
		// $("#inputVal").val("jq的val值")



}

</script>


</body>
</html>